<template>
    <div id="a">
        <ul>

            <li>
                <div class="title">
                    <span>热搜榜</span>
                    <div id="btn">
                        <svg>
                            <use xlink:href="#icon-sanjiao3"></use>
                        </svg>
                        <span>播放</span>
                    </div>
                </div>
                <ol>
                    <li></li>
                </ol>
            </li>
            <li>
                <div class="title">
                    <span>话题榜</span>
                </div>
                <ol>
                   <li></li>
                </ol>
            </li>
            <li>
                <div class="title">
                    <span>有声书榜</span>
                </div>
                <ol>
                    <li></li>
                </ol>
            </li>
            <li>
                <div class="title">
                    <span>播客榜</span>
                </div>
                <ol>
                    <li></li>
                </ol>
            </li>
            <li>
                <div class="title">
                    <span>视频榜</span>
                </div>
                <ol>
                    <li></li>
                </ol>
            </li>
        </ul>
    </div>

</template>

<script>
    export default {
        name: "SearchBangDan"
    }
</script>

<style scoped>
    #a{
        width: 95%;
        height:800px;
        margin: 10px 0 70px 5%;
        overflow-x: scroll;
        overflow-y: hidden;
    }
    #a::-webkit-scrollbar{
       display: none;
    }
    ul{
        height: 100%;
        width: 1205px;
    }
    ul>li{
        width: 230px;
        height: 100%;
        float: left;
        background: #fff;
        margin-right: 10px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .title{
        width: 85%;
        margin: 0 auto;
        height: 30px;
        margin-top: 15px;
        border-bottom: 1px solid lightgrey;
    }
    #btn{
        display: inline-block;
        float: right;
        border: 1px solid lightgrey;
        border-radius: 8px;
        height: 20px;
        line-height: 20px;
        font-size: 12px;
    }
    svg{
        width: 12px;
        height: 12px;
    }
    ol{
        width: 100%;
        margin-left: 35px;
    }
</style>